<template>
  <view>
    <view class="headercontainer">
      <uni-icons type="left" size="20" color="#fff" @click="back"></uni-icons>
      <view style="color: #fff; margin-right: 10rpx" @click="choosecountry">
        {{ city || '全球' }}
        <image src="@/sub_shop/static/images/bottom.png" style="width: 20rpx; height: 12rpx; vertical-align: middle; margin-right: 10rpx"></image>
      </view>
      <view class="headsearch">
        <uni-icons type="search" size="25"></uni-icons>
        <input type="text" placeholder="请输入商品名称" style="height: 68rpx; font-size: 26rpx" />
        <slot name="sort"></slot>
      </view>
      <image src="/sub_shop/static/images/headerrighticon.png" mode="" style="width: 44rpx; height: 44rpx"></image>
    </view>
  </view>
</template>

<script>
export default {
  name: 'headersearch',
  props: ['city'],
  data() {
    return {};
  },

  methods: {
    choosecountry() {
      uni.navigateTo({
        url: '/sub_goodstype/choosecountre/choosecountre'
      });
    },
    back() {
      uni.navigateBack();
    }
  }
};
</script>

<style lang="less" scoped>
.headercontainer {
  box-sizing: border-box;
  display: flex;
  align-items: center;
  width: 750rpx;
  height: 88rpx;
  border-radius: 0rpx 0rpx 0rpx 0rpx;
  .headsearch {
    display: flex;
    align-items: center;
    width: 494rpx;
    height: 68rpx;
    line-height: 68rpx;
    border-radius: 36rpx 36rpx 36rpx 36rpx;
    border-radius: 30rpx;
    background-color: #fff;
    margin-right: 20rpx;
  }
}
</style>
